<template>
	<view class="content columnbox wdh-100">
		<view v-if="list.length==0" style="margin-top: 20vh;">
			<u-empty text="暂无订单"></u-empty>
		</view>
		<!-- <button @click="scanCode">扫码</button> -->
		<view @click="showDetail(item.id)" class="one-goods columnbox" v-for="(item,index) in list" :key="index">
			<view class="d-info wdh-100 columnbox als">
				<view class="rowbox wdh-100 jus">
					<view class="d-name">{{item.Doctor.name}}</view>
					<view class="d-desc">| {{getDate(item.addtime)}}开具</view>
				</view>
				<view style="margin-top: 10rpx;" class="wdh-100 d-desc">就诊人：{{item.User.name}}
					{{item.User.sex==2?'女':'男'}} {{getAge(item.User.shengri)}}岁
				</view>
			</view>
			<view class="rowbox spb g-box wdh-100" v-for="(items,indexs) in item.List" :key="indexs">
				<image :src="items.images.split(',')[0]" mode="aspectFill" class="g-img"></image>
				<view class="columnbox als g-info">
					<view class="g-name">{{items.name}}</view>
					<view class="g-num">数量 * {{items.num}}</view>
				</view>
			</view>
			<view class="wdh-100 rowbox b-line" v-if="item.status==1">
				<view>未购买，暂无订单</view>
				<view class="def-bgcol one-btn">去购买</view>
			</view>
			<view class="wdh-100 rowbox b-line" v-else-if="item.status==2">
				<view>已付款</view>
			</view>
			<view class="wdh-100 rowbox b-line" v-else-if="item.status==3">
				<view>待发货</view>
			</view>
			<view class="wdh-100 rowbox b-line" v-else-if="item.status==4">
				<view>待收货</view>
			</view>
			<view class="wdh-100 rowbox b-line" v-else-if="item.status==5">
				<view>已完成</view>
			</view>
			<view class="wdh-100 rowbox b-line" v-else-if="item.status==6">
				<view>申请退款</view>
			</view>
			<view class="wdh-100 rowbox b-line" v-else-if="item.status==7">
				<view>同意退款</view>
			</view>
			<view class="wdh-100 rowbox b-line" v-else-if="item.status==8">
				<view>已取消</view>
			</view>
		</view>
	</view>
</template>

<script>
	import date from '@/utils/time.js'
	export default {
		data() {
			return {
				params: {
					pageNo: 1,
					pageSize: 20,
					userid: uni.getStorageSync('uid')
				},
				list: [],
				total: 0
			};
		},
		onLoad() {
			this.getOrder()
		},
		onReachBottom() {
			if (this.list.length < this.total) {
				this.params.pageNo++
				this.getOrder()
			}
		},
		methods: {
			getAge(v) {
				return date.getAge(v)
			},
			showDetail(id) {
				uni.navigateTo({
					url: './detail?id=' + id
				})
			},
			getDate(v) {
				return date.couponDate(v)
			},
			scanCode() {
				// uni.scanCode({
				// 	success: (res) => {
				// 		console.log(res)
				// 	}
				// })
				this.$req.post('/user/goodorderbd', {
					id: 34,
					userid: uni.getStorageSync('uid')
				})
			},
			getOrder() {
				this.$req.post('/user/goodorders', this.params).then(res => {
					this.list = this.list.concat(res.data.data.data)
					this.total = res.data.data.totalCount
				})
			},
			
		}
	}
</script>

<style lang="scss" scoped>
	.content {
		background: #F5F8FB;
		min-height: 100vh;
		justify-content: flex-start;
		font-family: PingFang SC;
	}

	.one-goods {
		width: 710rpx;
		background: #fff;
		border-radius: 10rpx;
		margin: 10rpx 0;
	}

	.d-info {
		background: linear-gradient(to bottom, #dffff3, #fff);
		padding: 20rpx 20rpx;
	}

	.d-name {
		font-size: 32rpx;
		font-weight: bold;
		margin-right: 20rpx;
	}

	.d-desc {
		font-size: 24rpx;
		color: #606069;
	}

	.g-box {
		margin-top: 20rpx;
		padding: 0 20rpx;
	}

	.g-img {
		width: 100rpx;
		height: 100rpx;
		border-radius: 10rpx;
	}

	.g-info {
		width: calc(100% - 120rpx);
		margin-left: 20rpx;
	}

	.g-name {
		width: 100%;
		font-size: 28rpx;
	}

	.g-num {
		font-size: 24rpx;
		color: #606069;
		margin-top: 10rpx;
	}

	.b-line {
		border-top: #eef1f1 solid 1px;
		margin-top: 20rpx;
		padding: 20rpx 20rpx;
		justify-content: flex-end;
		font-size: 24rpx;
	}

	.one-btn {
		padding: 10rpx 32rpx;
		border-radius: 100rpx;
		margin-left: 40rpx;
		color: #fff;
	}
</style>